<template>
	 <el-dialog v-model="dialogVisible"
		:title="dialogTitle"
	   :before-close="closeDialog"
		class="elDiaLog"
		lock-scroll width="1000px" 
		:close-on-click-modal="false" 
		:close-on-press-escape="false">
		<div class="">
			<div class="contc-left">
				<el-form ref="queryFormRef" :model="queryParams" :inline="true">
					<el-form-item prop="title">
						<el-input v-model="queryParams.title"  placeholder="请输入合同名称"  />
					</el-form-item>
					<el-form-item prop="contract_no">
						<el-input v-model="queryParams.contract_no"  placeholder="请输入合同编号"  />
					</el-form-item>
					<el-form-item prop="company">
						<el-input v-model="queryParams.company"  placeholder="请输入签订单位"  />
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="handleQuery"><template #icon><i-ep-search /></template>查询</el-button>
					</el-form-item>
				</el-form>
			</div>
			<el-table ref="dataTableRef" 
				v-loading="loading" 
				:data="dataList" align="left"
				tooltip-effect="dark" :show-overflow-tooltip="true"  border>		
				<el-table-column prop="id"  label="ID" align="center" width="50"></el-table-column>
				<el-table-column prop="title"  label="合同名称" align="center" min-width="200"></el-table-column>
				<el-table-column prop="contract_no"  label="合同编号" align="center" min-width="180"></el-table-column>
				<el-table-column prop="company"  label="签订单位" align="center" min-width="200"></el-table-column>
				<el-table-column prop="department.name"  label="所属部门" align="center" min-width="200"></el-table-column>
				<el-table-column prop="user.name"  label="经办人" align="center" min-width="140"></el-table-column>
				<el-table-column prop="add_time_text"  label="申请时间" align="center" min-width="200"></el-table-column>
				<el-table-column prop="add_time_text"  label="状态" align="center" min-width="150">
					<template #default="scope">
						<el-tag v-if="scope.row.status == 1" type="success">已通过</el-tag>
						<el-tag v-else type="info">待审中</el-tag>
					</template>
				</el-table-column>
				<el-table-column fixed="right" align="center" label="操作" width="150">
					<template #default="scope">
						<el-button type="primary" v-if="scope.row.status == 1" size="small" link @click="handleSelect(scope.row)">
						   <template #icon><i-ep-edit /></template>选择
						</el-button>
					</template>
				</el-table-column>
			</el-table>
			<pagination v-if="total > 0" v-model:total="total" v-model:page="queryParams.page"
				v-model:limit="queryParams.limit" @pagination="handleQuery" />
		</div>
	</el-dialog>
	
</template>
<script setup lang="ts">
	import { useRoute } from 'vue-router';
	import _ from 'lodash-es'
	
	import { useBaseConfigStore } from "@/store/modules/baseConfig";
	const baseConfigStore = useBaseConfigStore();

	//接口地址
	import {
		
		getContractList,
	
	} from "@/api/contract";
	const props = defineProps({
		//数据列表索引值  例如 user ->对应着 vuex  == user_cxxxxx模块
	    dialogTitle: {
	        type: String,
	        default:"选择合同"
	    }
	});

	const emit = defineEmits(['update:modelValue','selectRowEngin']);
	const queryParams = reactive({
	    page: 1,
	    limit: 20,
		title: "",//合同名称
		contract_no:"",//合同编号
		company:"",//签订单位
		status:1//审核状态
	})
	const dialogVisible = ref(false);
	const loading = ref(false);
	const total = ref(0);
	const dataList = ref();
	//获取工程信息列表
	function handleQuery() {
	    loading.value = true;
	    getContractList(queryParams).then((res) => {
	        console.log(res);
	        dataList.value = res.data.list;
	        total.value = res.data.count;
	    }).finally(() => {
	        loading.value = false;
	    })
	}
	// 关闭弹窗
	function closeDialog() {
		emit('update:modelValue',false)	
	}
	function handleSelect(row:any){
		if(row.status == 1)
		{
			emit('selectRowEngin',row);
			closeDialog();
		}
	}
	
	onMounted(() => {
		handleQuery();
	});
</script>

<style lang="scss" scoped>

</style>